<template>
  <div>
    <item
      v-for="(conversation, key) in conversations"
      :key="key"
      :conversation="conversation"
      class="user"
      :class="{ 'active': conversation.id == selected.id }"
      @click="handleSelected(conversation)"
    ></item>
  </div>
</template>

<script setup>
import '../../../assets/group.css'
import item from './Item.vue'

const props = defineProps({
  conversations: {
    type: Array,
    required: true,
  },
  selected: {
    type: Object,
    required: true,
  }
})

const emit = defineEmits(['handleSelected'])

const handleSelected = (item) => {
  emit('handleSelected', item)
}

</script>

<style scoped>
</style>
